<script setup lang="ts">
import { useHosMsgStore } from '@/stores/hospitalMsg'
const HosMsgStore = useHosMsgStore()
import { storeToRefs } from 'pinia'
const { hospitalMsg } = storeToRefs(HosMsgStore)
</script>

<template>
    <div style="height: 100%;">
        <h3>{{ hospitalMsg.hospital.hosname }} <em>👍{{ hospitalMsg.hospital.param.hostypeString }}</em></h3>
        <div class="rules">
            <img :src="`data:image/jpeg;base64,` + hospitalMsg.hospital.logoData" alt="">
            <div class="hospital-info">
                <p>具体位置：{{ hospitalMsg.hospital.param.fullAddress }}</p>
                <p>具体路线：{{ hospitalMsg.hospital.route }}</p>
            </div>
        </div>
    </div>

</template>

<style scoped lang="scss">
h3 {
    font-size: 1.5rem;
    font-weight: 600;

    em {
        font-weight: normal;
        font-size: 16px;
        color: var(--gray-color2);
    }
}

.rules {
    margin: 40px 0;
    display: flex;
    justify-content: start;

    img {
        width: 90px;
        height: 90px;
        border-radius: 50%;
        margin-right: 20px;
    }

    .hospital-info {
        flex: 1;

        p {
            color: var(--gray-color2);
        }

        p,
        h6 {
            margin-top: 10px;
        }
    }
}
</style>